<template>
	<view class="goodsList">
		<image :src='goodsUrl' class="goods-image"></image>
		<view :class="[type==1?'list-content':'list-content1']">
			<homeGoodsItem :dates="item" v-for="item in vipList" :key="item.goodsId" :type='type'
				@callBack='handleToDetails' />
		</view>
	</view>
</template>

<script>
	import {

		memberGoodsList,

	} from '@/api/api.js'
	import homeGoodsItem from "@/components/basicComponents/homeGoodsItem.vue"
	export default {
		components: {
			homeGoodsItem
		},
		data() {
			return {
				type: 1,
				vipList: [],
				pageSize: 20,
				pageNum: 1,
				pages: '',
			}
		},
		computed:{
			goodsUrl(){
				if(this.type==1){
					return require('@/static/static-home/vip.png')
				}else{
					return require('@/static/static-home/reco.png')
				}
			}
		},
		onLoad(e) {
			this.type = e.type
			let title = '批发商'
			if (this.type == 2) {
				title = '经销商'
			}
			uni.setNavigationBarTitle({
				title
			})

		},
		onShow() {
			this.pageNum = 1
			this.getMemberGoodsList()
		},
		onReachBottom() {
			if (this.pages <= this.pageNum) {
				uni.showToast({
					icon: 'none',
					title: '暂无更多~'
				})
				return
			} else {
				this.pageNum++
				this.getMemberGoodsList()
			}

		},
		methods: {
			// 获取会员礼包列表
			getMemberGoodsList() {
				let data = {
					type: this.type,
					pageNum: this.pageNum,
					pageSize: this.pageSize
				}
				memberGoodsList(data).then(res => {
					console.log(res.data)
					uni.stopPullDownRefresh()
					this.pages = res.data.pages
					let result = res.data.records || []
					if (this.pageNum == 1) {
						this.vipList = [...result]
					} else {
						this.vipList = [...this.vipList, ...result]
					}
				})
			},
			// 购买会员礼包
			handleToDetails(item) {
				uni.navigateTo({
					url: '/pages/index/goodsDetail?goodsId=' + item.goodsId + '&timestamp=0' + '&isVip=1' +
						'&source=index'
				})
			},
		}
	}
</script>

<style lang="less" scoped>
	.goodsList {
		line-height: 0rpx;
		.goods-image {
			height: 496rpx;
			width: 750rpx;
		}

		.list-content {
			margin-top: -2rpx;
			padding: 22rpx;
			min-height: 900rpx;
			border-bottom-left-radius: 10rpx;
			border-bottom-right-radius: 10rpx;
			height: auto;
			box-sizing: border-box;
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			grid-row-gap: 20rpx;
			grid-column-gap: 10rpx;
			background: linear-gradient(180deg, #FFB7B9 0%, #FFA9B1 100%); // background: url("@/static/static-home/home-1.png") no-repeat;
			// background: url("@/static/static-home/home-3.png") no-repeat;
			
		}

		.list-content1 {
			margin-top: -2rpx;
			padding: 22rpx;
			min-height: 900rpx;
			border-bottom-left-radius: 10rpx;
			border-bottom-right-radius: 10rpx;
			height: auto;
			box-sizing: border-box;
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			grid-row-gap: 20rpx;
			grid-column-gap: 10rpx;
			background: linear-gradient(180deg, #FD503D 0%, #FE8F70 100%); // background: url("@/static/static-home/home-1.png") no-repeat;
			// background: url("@/static/static-home/home-2.png") no-repeat;
		
		}
	}
</style>